<template>
	
		<el-row>
			<el-col :span="4">
				<div style="" />
			</el-col>
			<el-col :span="18">
				<el-card style="height: 500px;">
					<h2 style="text-align: left; font-family: Helvetica Neue; color: darksalmon; ">用户留言板：</h2>
					
					<div v-if="this.param.userId">
					<el-input v-model="online" :rows="10" type="textarea" placeholder="请输入留言内容"/>
					<el-row>
						<el-col :span="8"/>
							
						
						
						<el-col :span="8">
							<el-button @click="save()" type="primary" style="margin: 10px; width: 80px;">提交</el-button>
							<el-button @click="clear()" style="margin: 10px; width: 80px;">取消</el-button>
						</el-col>
						
						<el-col :span="8"/>
						
						
					</el-row>
					</div>
					
					<div v-else>
						<p>请先登录再留言！</p>
					</div>
				</el-card>
			</el-col>
			
			<el-col :span="4">
				<div style="" />
			</el-col>
		</el-row>
	
</template>


<script>
	import { ElMessage } from 'element-plus'
	export default {
		name: "Online",
		data() {
			return{
				online:"",
				param: {
					userId: '',
					content: ','
				},
			}
		},
		
		created() {
			this.param.userId = window.sessionStorage.getItem("userId");
		},
		
		methods:{
			
			save(){
				this.param.content =this.online;
				this.$api.post("/online/add",this.param).then((res)=>{
					if(res.data.code === "200"){
						ElMessage.success('留言成功');
						this.clear()
						
					}else {
						ElMessage.error("留言失败");
					}
				})
				
			},
			clear(){
				this.online = "";
			}
			
		}
	}
</script>

<style>
</style>
